import { Component, toNative, Watch } from 'vue-facing-decorator'
import Render from '@/render/Render'
import Left from '../layout/Left'
import Main from '../layout/Main'
import router from '../router'
import { RouterView, type RouteRecord } from 'vue-router'

@Component
export class HomeView extends Render {
    router = router.currentRoute

    @Watch('router', {immediate: true})
    fullscreenWatch(newValue: RouteRecord){
        this.fullscreen = !!newValue.meta.fullscreen
    }

    fullscreen = false

    render() {
        return this.fullscreen ? <RouterView/> : <div class="w-screen h-screen flex justify-center">
            <div class='grid h-full grid-cols-[200px,auto]'>
                <Left />
                <Main />
            </div>
        </div>
    }
}

export default toNative(HomeView)